import { styled } from "styled-components";

export const AreaModalv1Wrapper = styled.div`
  position: absolute;
  left: 50%;
  top: 50%;
  width: 50vw;
  transform: translate(-50%, -50%);
  background: rgba(36,36,36,.88);
    border: 1px solid hsla(0,0%,100%,.08);
    backdrop-filter: blur(12px) opacity(1);
    padding: 24px 0;
    border-radius: 12px;
    width: 50vw;
    margin: auto 0;
    font-size: 14px;
    z-index: 100;
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - 192px);

    .heder {
      padding: 0 20px;
      display: flex;
      justify-content: space-between;
      margin-bottom: 20px;;

      .left-title {
        font-size: 16px;
        font-weight: 600;
      }
      
      .cancel {
        cursor: pointer;
      }
    }

    .coniner {
      padding: 20px;
      white-space: pre-line;
      font-size: 16px;
      opacity: .92;
    }
`